<ion-view class="bg-f7 search-wrapper">
    <div class="search-header bg-white border-1px-ccc">
        <div ng-click="closeModal()" class="search-box border-1px-f5">
        <div class="bar bar-header item-input-inset search-wrapper">
            <button ng-click="back()" class="button bg-white fs-0"><i class="icon ion-ios-arrow-back color-333 fs-18"></i>
            </button>
            <label class="item-input-wrapper">
                <i class="icon ion-ios-search-strong fs-18"></i>
                <input ng-model="submitData.keyword" ng-focus="isFocus = true;" ng-blur="isFocus = false;" class="color-222" type="search" placeholder="输入关键字搜索店铺">
                <i ng-click="submitData.keyword='';stopBubbling($event);" class="icon ion-ios-close color-333 fs-18"></i>
            </label>
        </div>
        </div>
        <div class="weui-flex bg-white com-filter">
            <div ng-click="showAreaModal()" class="weui-flex__item filter-item">
                <span>重庆市</span>
                <i class="icon fs-18" ng-class="{true:'ion-ios-arrow-up', false:'ion-ios-arrow-down'}[areaModal]"></i>
            </div>
            <div class="line"></div>
            <div ng-click="showTypeModal()" class="weui-flex__item filter-item">
                <span>距离优先</span>
                <i class="icon fs-18" ng-class="{true:'ion-ios-arrow-up', false:'ion-ios-arrow-down'}[typeModal]"></i>
            </div>
        </div>
    </div>
    <ion-content style="top: 88px" overflow-scroll="false" scrollbar-y="false" has-bouncing="false">
        <!--搜索历史-->
        <div ng-show="isFocus" class="pad-side-15 history">
            <ul class="fs-0">
                <li class="label">年检</li>
                <li class="label">停车场</li>
                <li class="label">不正缴费</li>
                <li class="label">不正缴费</li>
                <li class="label">不正缴费</li>
                <li class="label">不正缴费</li>
            </ul>
            <div class="text-center">
                <a href="javascript:void(0);" class="clear-btn inline-block color-base fs-14 text-center">清空搜索记录</a>
            </div>
        </div>
        <!--搜索结果-->
        <div class="result">
            <div class="com-list">
                <div ui-sref="shop.detail({id: item.id})" ng-repeat="item in shopList" class="weui-flex com-list-item border-1px-f5">
                    <div class="img-cont">
                        <img src="./asset/car_customer/images/data/shop.jpg" class="img">
                        <div class="mask fs-10 text-center color-white">商家休息中</div>
                    </div>
                    <div class="weui-flex__item item-cont">
                        <div class="my-title fs-0">
                            <h2 class="title color-333 fs-14 inline-block txt-line-1">重庆靓车会专业汽车重庆靓车会专业汽车</h2>
                            <div class="label label-order fs-10 inline-block color-white">预</div>
                            <div class="label label-buy fs-10 inline-block color-white">购</div>
                        </div>
                        <div class="star">
                            <span><i class="icon ion-ios-star"></i></span>
                            <span><i class="icon ion-ios-star"></i></span>
                            <span><i class="icon ion-ios-star"></i></span>
                            <span><i class="icon ion-ios-star-half"></i></span>
                        </div>
                        <div class="detail fs-10 color-999 txt-line-1">洗车、美容、保养、维修</div>
                        <div class="adress fs-10 color-ccc ver-top txt-line-1"><i class="icon ion-ios-location ver-top"></i>
                            1.5km 重庆市渝北区龙山三路16号春风城重庆市渝北区龙山三路16号春风城
                        </div>
                    </div>
                    <div class="price">￥30</div>
                </div>
                <!--无限加载-->
                <div ng-show="true" class="weui-loadmore weui-loadmore_line">
                    <span class="weui-loadmore__tips bg-f7">已经到底了</span>
                </div>
                <!--无限加载使用这个样方式进行 开关  ng-if="hasMore" -->
                <!--如果不需要则删除即可-->
                <ion-infinite-scroll
                        ng-if="hasMore"
                        on-infinite="onLoadMore()"
                        spinner="ios"
                        distance="1%">
                </ion-infinite-scroll>
            </div>
        </div>
    </ion-content>
    <!--地区选择-->
    <div ng-show="areaModal" ng-click="closeModal()" class="my-filter-modal" ng-class="{true:'show', false:'hide'}[areaModal]">
        <ion-content class="filter-cont" overflow-scroll="false" scrollbar-y="false" has-bouncing="false">
            <ul class="pad-side-15 bg-white area-list">
                <li ng-repeat="item in areList track by $index" class="my-item border-1px-f5">{{item.name}}</li>
            </ul>
        </ion-content>
    </div>
    <!--类型选择-->
    <div ng-show="typeModal" ng-click="closeModal()" class="my-filter-modal" ng-class="{true:'show', false:'hide'}[typeModal]">
        <ion-content class="filter-cont" overflow-scroll="false" scrollbar-y="false" has-bouncing="false">
            <ul class="pad-side-15 bg-white area-list">
                <li ng-repeat="item in typeList track by $index" class="my-item border-1px-f5">{{item.name}}</li>
            </ul>
        </ion-content>
    </div>
</ion-view>